import Taro,{ Component } from '@tarojs/taro'
import { View,Image} from '@tarojs/components'
import { AtButton } from 'taro-ui'
import './findHospital.css'
import app from '../../main.js'

export default class FindHospital extends Component {

    config = {
        navigationBarTitleText: '找医院'
    }

    constructor () {
        super(...arguments)
        this.state = {
            cameraIco:'width:120px;height:96px; margin:15px 0 0 0 ',
            hospital:[],
            kongge:' ',

            //img
            wechat: 'https://zhongsheng.bayou-tech.cn/img/imgs/wechat.png',
            eyes: 'https://zhongsheng.bayou-tech.cn/img/imgs/eyes.png',
            ifshow:''
        }
    }

    //跳转到医院详情
    gotoHopDetails(id,name){
        app.navigateTo('../hopDetails/hopDetails?id=' + id + '&title='+name)
    }

    offset = 0
    length = 20
    total = ''

    //上拉加载
    //
    onReachBottom(){
        if ((this.length < this.total)) {
            app.toast('正在加载----')
            this.length = 20 + this.length;
            this.isFinlsh = false;
            //调用接口
        }else{
            app.toast('没有更多数据了咯')
            this.isFinlsh = true;
        }
    }

    //get 医院
    gethospital(){
        let me = this;
        let data = {
            offset: this.offset,
            length: this.length
        }
        app.post('web/hospital/hospitalList', data, function(res) {
            console.log(res)
            let list = res.data.result.list
            me.total = res.data.result.total
            for(let i = 0; i < list.length; i++){
                for(let j = 0; j < list[i].labels.length; j++){
                    if(list[i].labels[j] == ''){
                        list[i].labels.splice(j,1)
                    }
                }
            }
            me.setState({
                hospital:list
            })
        })
    }

    componentWillMount(){
        this.gethospital();
    }

  render () {

    let list = this.state.hospital.map((item,index) => {
	  return<View className='box' onClick={this.gotoHopDetails.bind(this,item.id,item.name)}>
				<View className='imgBox'>
					<Image class='h_img' src={item.image}/>
				</View>
				<View className='box-a'>
					<View className='text-a'>{item.name}</View>
					<View className='btnbox' style={item.labels.length == 0 || item.labels.length == undefined ? 'margin-top:23px' : ''}>
						{ item.labels.map((label)=>{
                            return <AtButton className={item.labels.length == 0 || item.labels.length == undefined || item.labels.length == null ? 'noshow' : 'btn'} type='secondary' size='small' circle>{label}</AtButton>
                        }) }
					</View>
					<View className='box-B'>
                        <View className='box-b'>
                            <Image src={this.state.wechat} className='img1'></Image>
                            <View className='text-b'>{item.serve_number}万次咨询</View>
                        </View>
                        <View className='box-b2'>
                            <Image src={this.state.eyes} className='img2'></Image>
                            <View className='text-b'>{item.serve_number}人预约</View>
                        </View>
                    </View>
					<View className='clean'></View>
					<View className='text-c'>{item.province}{this.state.kongge}{item.city}{this.state.kongge}{item.district}</View>
				</View>
			</View>			
    })

    return (
      	<View className='findHospital'>
			{list}
      	</View>
    )
  }
}